<template>
  <div>
    <SearchAndTable
      :searchData="searchData"
      :operateData="operateData"
      :columns="columns"
      ref="table"
    />

  </div>
</template>

<script>
import SearchAndTable from '@/components/SearchAndTable/index'
import EditForm from '@/components/EditForm/index'
import Dialog from '@/components/Dialog/index'
import { getTableData } from '@/api/app'
let dialogShows = {
  add: false,
  edit: false,
  del: false,
  view: false
}
export default {
  name: 'statistics',
  components: {
    SearchAndTable,
    Dialog,
    EditForm
  },
  data () {
    return {
      dialogShows: {...dialogShows},
      currentInfo: {},
      searchData: [
        {
          label: '小课程名称',
          labelWidth: 110,
          colSpan: 6,
          key: 'name'
        },
        {
          label: '学习进度',
          labelWidth: 110,
          colSpan: 6,
          key: 'title'
        },
        {
          label: '学习时长',
          labelWidth: 90,
          colSpan: 6,
          key: 'company'
        },
        {
          label: '其他',
          labelWidth: 90,
          colSpan: 6,
          key: 'account'
        }
      ],
      operateData: [],
      columns: [
        {
          title: '小课程名称',
          align: 'center',
          minWidth: 120,
          key: 'name'
        },
        {
          title: '学习进度',
          align: 'center',
          minWidth: 120,
          key: 'phone'
        },
        {
          title: '学习时长',
          align: 'center',
          minWidth: 120,
          key: 'company'
        },
        {
          title: '其他',
          align: 'center',
          minWidth: 120,
          key: 'account'
        }
      ],
      infos: [
        {
          label: '用户名',
          key: 'name',
          rules: true
        },
        {
          label: '手机号',
          key: 'userName',
          rules: true
        }
      ]
    }
  },
  methods: {
    async getTableData (page, size) {
      let res = await getTableData(page, size)
      if (res.message) {
        this.$router.push('/login')
      }
      if (res.data) {
        let { content: data, total } = res.data
        return { data, total }
      } else {
        this.$Message.error(res.message)
        return { data: [], total: 0 }
      }
    },
    cancel () {
      this.resetDialog()
    },
    add () {
      this.resetDialog()
    },
    del () {
      this.resetDialog()
    },
    edit () {
      this.resetDialog()
    },
    resetDialog () {
      this.dialogShows = {...dialogShows}
    }
  }
}
</script>

<style lang="" scoped>
</style>
